<template>

<view class="sku">
          <u-skeleton rows="6" :loading="loadingContent" :rowsHeight="[
            '42',
            '42',
            '42',
            '42',
            '42',
            '42',
            '42',
            '42',
            '300'
          ]" :rowsWidth="[
  '125%',
  '125%',
  '100%',
  '125%',
  '200%',
  '200%',
  '200%',
  '200%',
  '200%'
]" :title="false" :animate="true">
            <view class="content">
              <u-parse :content="props.content" @ready="handleReady" style="width: 100%;"></u-parse>
            </view>
          </u-skeleton>
        </view>
        
        <!-- <u-parse :content="props.content" @ready="handleReady" style="width: 100vw;"></u-parse> -->
</template>

<script setup lang="ts">

import { ref,defineProps } from 'vue'

const loadingContent = ref(true)

const props = defineProps({

    content: String
})

const handleReady = () =>{

    loadingContent.value = false
}

</script>

<style scoped>
.content{
  width: 100%;
}
.sku{
  width: 100%;
}
</style>